<template>
<div>
<Header></Header>
    <div class="list_banner" style="background-image: url(lib/images/list_banner_1.jpg);"></div>
    <div class="active_con index_box_1">
        <ul class="active_menu">
            <li class="on"><a href="javascript:void(0);">活动</a></li>
            <li><a href="javascript:void(0);">游记</a></li>
        </ul>
        <div class="active_con_slide">
            <ul class="active_ul">
                <li  v-for="active in list1">
                     <router-link :to="'/active/detail/' + active.id">
                        <p class="pt"><img width="246" height="164" :src="sftpPathPrefix + active.image"><span class="label_wz">活动</span></p>
                        <p class="name">{{active.title}}</p>
                        <p class="wz">活动时间：{{active.weightDate}}</p>
                    </router-link>
                </li>
            </ul>
            <ul class="active_ul" style="display: none;">
            	<li  v-for="active in list2">
                   <router-link :to="'/active/detail/' + active.id">
                        <p class="pt"><img width="246" height="164" :src="sftpPathPrefix + active.image"><span class="label_wz">游记</span></p>
                        <p class="name">{{active.title}}</p>
                         <p class="wz"><span class="ic_eye">{{active.hits}}</span>看过 | {{active.createDate}}</p>
                   </router-link>
                </li>
            </ul>
        </div>
    </div>
    <Footer></Footer>
</div>
</template>
<script>
import common from "../utils/common";
import Header from "../components/Header.vue";
import Footer from "../components/Footer.vue";
export default {
  components: {
    Header,
    Footer
  },
  mounted: function() {
    this.loadList();
    this.initClick();
  },
  methods: {
    loadList: function() {
    	var self = this;
    	var url=common.getApiPrefix()+"api/portal/web/article/listById/4028b0ff6380971f0163809823a20001";
    	common.doGet(url,function(data){
    		self.list1 = data;
    	});
    	var yopujiUrl=common.getApiPrefix()+"api/portal/web/article/listById/4028b0ff6380971f01638098bd670002";
    	common.doGet(yopujiUrl,function(data){
    		self.list2 = data;
    	});
    },
    initClick:function() {
     $(".active_menu>li").click(function(){
        $(this).addClass("on").siblings().removeClass("on");
        var index = $(this).index();
        $(".active_con_slide>ul").eq(index).show().siblings().hide();
    });
    }
  },
  data: function() {
    return {
    	sftpPathPrefix: common.getFtpPrefix(),
    	list1:[],
    	list2:[]
    };
  }
};
</script>